<template>
	<div class="login">
		<Input class="login-info" v-model="username" placeholder="请输入用户名" style="width: 300px" />
		<Input class="login-info" type="password" v-model="password" placeholder="请输入密码" style="width: 300px" />
		<Input class="login-info" type="password" v-model="repassword" placeholder="请再次输入密码" style="width: 300px" />
		<p><Button type="primary" @click="axiosLoginrUser()">登入</Button></p>
	</div>
</template>

<script>
import axios from 'axios'
import {Toast} from 'vant'
import { resolve, reject } from 'q';
export default {
	data(){
		return {
			username: '',
			password: '',
			repassword:'',
			openLoading: false,    //是否开启用户的Loading
		}
	},
	methods:{
		axiosLoginrUser() {
			// this.$router.push({name:'index'})
			if(this.username.length<5){
				Toast.fail('用户名不能少于5位')
			}else{
				if(this.password.length<6){
					Toast.fail('密码不能少于6位')
					return false
				}
				if(this.password!=this.repassword){
				alert("两次密码不一致")
				}else{
						axios.post('/user/login',{
						userName:this.username,
						password:this.password
					}).then(response=>{
						console.log(response)
						if(response.data.code==200 && response.data.message){
							console.log('登录成功')
							Toast.success('登录成功')
							this.$router.push({name:'index'})
						}else{
							console.log(response.data.message)
							Taost.fail('登录失败')
						}
						console.log(response.data.code)
					}).catch(err=>{
						console.log('登录失败')
						Toast.fail('登录失败')
					})
				}
			}
			
		},
	}
}
</script>

<style lang="stylus" scoped>
div.login
	margin 50px auto
	padding 20px
	border 1px solid #ddd
	width 600px
	text-align center
	.login-info
			margin-top 20px
	p
		text-align center
	Button
		margin-top 20px
</style>

